/** @file MapView.qml
@brief MapView object to display a Ovi Map in the viewver application

This object manages a  map with navigation buttons for map mode, auto zoom
and zooming buttons.

@authorname \n
@licenseversion \n
@actualversion - @dateupdate

@licensenote
*/

import QtQuick 1.0
import QtMobility.location 1.2
import "MapView.js" as Navigation
import "Theme.js" as JsObj

Item {
    id: mapView

    width: objLoad.getWidth();
    height: objLoad.getHeight();

    property int minZoom: 5
    property int maxZoom: 17
    property int progress: 1
    property int mapViewModes: 1
    property int buttonSize:  55
    // Current zoom factor of the map view
    property int currentZoom: 17

    // Set the map to the desired location (latitude, longitude)
    function setLocation (lat, lon)  {
        geoCoord.latitude = lat;
        geoCoord.longitude = lon;
        map.center = geoCoord;
    }
    // Set the map to the desired zoom factor
    function setMapZoom (zoom)  {
        map.zoomLevel = zoom;
    }

    Map {
        id: map
        anchors.fill: parent
        size.width: parent.width; size.height: parent.height
        plugin : Plugin { name : "nokia" }
        mapType: Map.StreetMap
    }

    // A coordinate component
    Coordinate {
        id: geoCoord
    }

    // UI mouse interaction is used to move the map on the viewer.
    MouseArea {
        anchors.fill: parent

        property bool mouseDown : false
        property int lastX : -1; property int lastY : -1

        onPressed : { mouseDown = true; lastX = mouse.x; lastY = mouse.y }
        onReleased : { mouseDown = false }

        // Mouse position changes are mapped to the map traslation
        onPositionChanged: {
            if (mouseDown) {
                var dx = mouse.x - lastX; var dy = mouse.y - lastY
                map.pan(-dx, -dy);
                lastX = mouse.x; lastY = mouse.y
            }
        }
    }

    // Buttons to manage the map zooming factor.
    Column {
        id: zoomButtons

        // Set the transparency level to position the object on the map
        opacity: 0.9
        // Set relative sizes, anchors and position to see correct on the screen
        anchors.verticalCenter: parent.verticalCenter
        anchors.left: parent.left
        width: buttonSize
        anchors.leftMargin: parent.width * 0.07
        spacing: parent.height * 0.35

        SubLoader {
            id: zoomIn
            width: buttonSize
            height: buttonSize
            theme: objLoad.getTheme();
            obj: "MapButton";
            obj_string: "+"
            obj_icon: JsObj.getButton(objLoad.getTheme())
            onClicked: { setMapZoom(++currentZoom) }
        }
        SubLoader {
            id: zoomOut
            width: buttonSize
            height: buttonSize
            theme: objLoad.getTheme();
            obj: "MapButton";
            obj_string: "-"
            obj_icon: JsObj.getButton(objLoad.getTheme())
            onClicked: { setMapZoom(--currentZoom) }
        }
    }

    // Crosshair indicator centered on the map view.
    SubLoader {
        id: crosshairIndicator

        width: buttonSize; height: buttonSize
        anchors.horizontalCenter: mapView.horizontalCenter
        anchors.verticalCenter: mapView.verticalCenter
        theme: objLoad.getTheme();
        obj: "MapButton";
        obj_icon: JsObj.getNavCenter(objLoad.getTheme())
        onClicked: { currentZoom = Navigation.swapZoom() }
    }

    // Swap map mode indicator.
    SubLoader {
        id: swapMapMode
        width: buttonSize
        height: buttonSize
        opacity: 0.9
        anchors.bottom: mapView.bottom
        anchors.right: mapView.right
        anchors.rightMargin: mapView.width * 0.05
        anchors.bottomMargin: mapView.width * 0.05
        theme: objLoad.getTheme();
        obj: "MapButton";
        obj_icon: JsObj.getNavView(objLoad.getTheme())
        onClicked: { Navigation.swapMapView() }
    }
}
